<template>
    <div class="hc-card">
        <el-card class="box-card">
            <el-scrollbar class="scroll-Y">
                <div @click="cardClick(o)" v-for="(o,i) in cardData" :key="i" class="text item" v-html="o.title">
                </div>
            </el-scrollbar>
        </el-card>
    </div>
</template>

<script>
    import {clickEvent} from "../../event/eventClick";

    export default {
        props: {
            cardData: {
                type: Array,
                default: []
            },
            otherObj: {
                type: [Object, Function],
                default: () =>
                {
                    return {

                    };
                },
            },
            event: {
                type: Object
            }
        },
        name: "HCCARD",
        data()
        {
            return {

            }
        },
        created()
        {
            console.log(this.event,this.cardData)
        },
        methods:{
            cardClick(data){
                clickEvent(this.event,data,this.otherObj);
            },
        }
    }
</script>

<style lang="scss" scoped>
    .hc-card {
        height: 100%;

        .text {
            font-size: 14px;
        }

        .item {
            padding: 5px 0;
        }

        .box-card {
            height: 100%;

            ::v-deep .el-card__body{
                height: 100%;
            }
        }
    }
</style>